<script>
  import MyDown from './components/MyDown.vue';
  import MyHeader from './components/MyHeader.vue';
  import MyLister from './components/MyLister.vue';
  
  
  export default {
    components:{ MyHeader, MyLister, MyDown }
  }

</script>

<template>
  <div id="kj">
    <div id="tit">待办记录本</div>
    <hr>
    <MyHeader/>
    <hr>
    <MyLister/>
    <hr>
    <MyDown/>
  </div>
</template>

<style>
  #tit{
    font-family:'幼圆';
    font-size: 28px;
    letter-spacing: 10px;
    font-weight: 800;
    color: rgba(194, 13, 13, 0.76) ;
  }
  #kj {
    width: 50vw;
    min-width: 500px;
    border: 1px solid black;
    border-radius: 20px;
    padding: 20px;
    margin: 1vh auto;
    text-align: center;
    background: linear-gradient(to bottom right,rgba(0, 162, 255, 0.473),rgb(255, 192, 203)) ;
  }

</style>